import { Component, Emit, Prop, Watch } from 'vue-facing-decorator'
import Render from '@/render/Render'
import toNative from '@/utils/toNative'

import renderModal, {
    getModelValue,
    initModelValue,
    type FormModalDto
} from '@/components/modal/Modal'
@Component
export class BaoshiPlanNumPopView extends Render {
    @Prop() show!: boolean

    @Emit('update:show')
    updateShow(val: boolean) {
        return val
    }

   @Watch('show', { immediate: true })
    handleWatchShow() {
        this.formConfig.show = this.show
    }

    @Watch('formConfig.show', { immediate: true })
   handleWatchShowDialog() {
       this.updateShow(this.formConfig.show)
   }
    

    formConfig = this.initFormConfig() as FormModalDto

    initFormConfig() { 
        return {
            title: '工种复审',
            width: '450px',
            theme: 'dark',
            show: false,
            params: { 
                confirmText:'确定'
            },
            items: {
                insuranceId: {
                    name: '保司方案',
                    element: 'datetime',
                    required: true,
                    // remote: true,
                },
                numList: {
                    value: null,
                    name: '保单号',
                    element: 'inputs',
                    required: true,
                    placeholder: '请输入保单号',
                    params: {
                        minNum: 1,
                        maxNum: 10,
                        type:''
                    },
                    callback: {
                        change: (event: string[]) => {
							this.formConfig.items!.numList!.value = event
                        }
                    }
                },
                date: {
                    name: '生效月份',
                    element: 'datetime',
                    required: true,
                    // remote: true,
                },
            },
            complete: async () => {
                const data = getModelValue(this.formConfig)
                console.log(data, 'datadata')
                this.formConfig.show = false
            },
            cancel: () => {
                this.formConfig.show = false
            }
        } as FormModalDto
    }


    render() { 
        return (
            <>
                { renderModal(this.formConfig) }
            </>
        )
    }
}

export default toNative<{show:boolean}, {}>(BaoshiPlanNumPopView)